<%@page import="model.entity.product.Color"%>
<%@page import="util.GroupingUtil"%>
<%@page import="model.entity.product.Sizes"%>
<%@page import="java.util.Set"%>
<%@ page import="model.entity.product.Product.*"%>
<%@ page import="dao.AbstractDAO"%>
<%@ page import="dao.entity.ProductDAO"%>
<%@ page import="dao.JPAHiberDAOFactory"%>
<%@ page import="java.util.List"%>
<%@ page import=" model.entity.product.Product"%>

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@include file="headerLink.jsp"%>
<title>Chi tiet san pham</title>

<script type="text/javascript">
	$(function() {
		var $container = $('#productContainer');
		$container.imagesLoaded(function(){
		  $container.masonry({
		    itemSelector : '.products-box'
		  });
		});
	});
</script>
</head>
<body>


	<div id="nen">
		<jsp:include page="menuLeft.jsp"></jsp:include>

		<div id="khungGiua">
			<jsp:include page="header.jsp"></jsp:include>
			<div style="clear: left;"></div>
			<% 
				String idSP = request.getParameter("idSP");
				if(idSP != null){
					Product sanPham = JPAHiberDAOFactory.getInstance().getProductDAO().findByID(Integer.parseInt(idSP));
					if(sanPham != null) {
						Set<Sizes>  dsSize =  GroupingUtil.groupSize(sanPham.getProductDetailses());
						Set<Color>  dsColor =  GroupingUtil.groupColor(sanPham.getProductDetailses());
			%>
			<div id="noiDung">
				<!-- khung chua hang -->
				<div id="khungSanPham">
					<form>
					<div id="chiTietSP">
						<div id="tenSP">
							<a class="tenSanPham"></a>
						</div>
						<div id="images_size">
							<div class="images" >
								<img alt="No image"  style="width: auto;height: 100%;" src="../<%=sanPham.getImage()%>">
							</div>
							<div id="size">
								<div class="gia">
									<span>giá: </span><span class="giaSP"><%= sanPham.getPrice() %> VND</span>
								</div>
								<div class="size">
									<span>size: </span>
									<% for(Sizes s : dsSize) { 
										if(!s.getName().equals("")) {
									%>
									<input type="radio" name="size" value="<%=s.getSizeId()%>"><%=s.getName()%>
									<%}} %>
								</div>
								<div class="color">
								<table>
									<tr>
										<td>
									<span>màu: </span>
										</td>
										<td>
										<ul>
										<% for(Color s : dsColor) {
										if(!s.getName().equals("")) 
										{ %>
										<li style="display: inline-block;">
										<table>
										<tr>
										<td>
											<input type="radio" name="color" value="<%=s.getColorId()%>">
										</td>
										<td>
											<div style="width: 30px;height: 30px;background-color: #<%=s.layColorRGBCode()%>"></div>
										</td>	
											</tr>
										</table>
										</li>	
											<%} }%>
										</ul>
										</td>
									</tr>
								</table>
								</div>
								<div class="soLuong">
									<span>số lượng: </span> <input type="text" value="1">
								</div>
								<div class="mua">
									<button type="button" title="mua ngay">mua ngay</button>
								</div>
								<div class="gioHang">
									<a href="#"><span>Thêm vào giỏ hàng</span></a><br>
									<br> <span>Điên thoại đặt hàng: 0983619675</span>
								</div>
							</div>
						</div>
					</div>
					
					<div id="khungSanPham">
					<!-- thanh ngang 1 -->
					<div id="danhSachSanPham" class="danhSachSanPhamTren">
						<ul>
							<li>
								<a href="#">giày vải</a>
							</li>
						</ul>
					</div>
					
					<!-- khung thoi trang nam -->
					<div id="thoiTrang">
					<div id="productContainer">
					<%
					List<Product> toanBo = JPAHiberDAOFactory.getInstance().getProductDAO().selectAll();
					for (Product sanpham: toanBo) {
					%>
						
						<div class="products-box slowTrans">
							<table>
								<tr>
									<td colspan="2">
										<img alt="No image" src="../<%=sanpham.getImage()%>">
									</td>
								<tr>
									<td colspan="2">
										<%=sanpham.getName()%>
									</td>
								</tr>
								<tr>
									<td>
										<span class="price"><%=sanpham.getPrice()%></span>
									</td>
									<td class="acctionGr">				
										<a rel="tooltip" title="Add to Cart" class="btn-cart slowTrans">&nbsp;</a>
										<a rel="tooltip" class="link-wishlist  slowTrans" title="Add to Wishlist">&nbsp;</a>
										<a rel="tooltip" class="link-compare  slowTrans" title="Add to Compare" href="ChiTietSanPham.jsp?idSP=<%=sanpham.getProductId()%>">&nbsp;</a>
									</td>
								</tr>
							</table>
						</div>
					<% } %>
						</div>
					
					</div>
					<div style="clear: left;"></div>
					<div id="danhSachSanPham" class="danhSachSanPhamDuoi">
						<ul>
							<li>
								<a href="#">giày vải</a>
							</li>
						</ul>
					</div>

				</div>
					
					
					</form>
					<div style="clear: left;"></div>
					<div style="clear: left;"></div>



					<!-- xoa can le  
					<div style="clear: left;"></div>
					-->


				</div>


			</div>
			<!-- dong the noi dung -->
			<% 		}
				} %>
			<div id="diaChi"></div>

		</div>

		<!-- menu nu -->

		<jsp:include page="menuRight.jsp"></jsp:include>


	</div>

</body>
</html>